<!DOCTYPE html>
<html lang="en"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>机构管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="icon" href="../../../static/images/favicon.ico" th:href="@{/images/favicon.ico}">
    <link rel="stylesheet" href="../../../static/plugin/layui/css/layui.css" th:href="@{/plugin/layui/css/layui.css}" media="all" />
    <link rel="stylesheet" href="../../../static/back_css/public.css" th:href="@{/back_css/public.css}" media="all" />
    <link rel="stylesheet" href="../../../static/back_css/account_management.css" th:href="@{/back_css/account_management.css}" media="all">
</head>
<body>
<div class="container">
    <div class="container_top">
        <div style="display: none">
            <input type="text" placeholder="请输入关键字" class="layui-input" name="id" id="demoReload" autocomplete="off">
            <button data-type="reload" class="layui-btns"><i class="layui-icon layui-icon-search"></i></button>
        </div>
        <div th:if="${level}!=4">
            <button type="button" id="add_account" class="layui-btn layui-btn-xs layui-btn-warm">+添加机构</button>
        </div>
    </div>
    <div class="container_content">
        <table class="layui-hide" id="test" lay-filter="test"></table>
    </div>
</div>
<div class="edit_id" style="display: none;">
    <form class="layui-form" action="" method="get">
        <div>
            <span>编辑机构</span>
            <button id="close" type="button"><i class="layui-icon">&#x1006;</i></button>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">机构名称：</label>
            <div class="layui-input-block">
                <div class="layui-input-inline">
                    <input type="text" id="district_NAME" name="DISTRICT_NAME" lay-verify="required" autocomplete="off" placeholder="请输入机构名称" class="layui-input">
                    <input type="hidden" id="id" name="ID">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">省份：</label>
            <div class="layui-input-block">
                <div class="layui-input-inline">
                    <input type="text" id="province" name="PROVINCE" lay-verify="required" autocomplete="off"
                        placeholder="请输入省份" class="layui-input">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">地区城市：</label>
            <div class="layui-input-block">
                <div class="layui-input-inline">
                    <input type="text" id="city" name="CITY" lay-verify="required" autocomplete="off"
                        placeholder="请输入机构名称" class="layui-input">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">数据归集等级：</label>
            <div class="layui-input-block">
                <div class="layui-input-inline">
                    <input type="‌number‌" id="data_LEVEL" name="DATA_LEVEL" lay-verify="required" autocomplete="off"
                        placeholder="请输入数据归集等级,只能填写数字" class="layui-input">
                </div>
            </div>
        </div>
        
        <div class="layui-form-item" style="display: none;">
            <label class="layui-form-label">服务器编号：</label>
            <div class="layui-input-block">
                <div class="layui-input-inline">
                    <input type="text" id="server_ID" readonly name="SERVER_ID" th:value="${server_id}" lay-verify="required" autocomplete="off" placeholder="请输入机构名称" class="layui-input">
                </div>
            </div>
        </div>
        <input type="hidden" name="action" id="form_action">
        <div class="layui-form-item_btn">
            <button type="button" class="layui-btn " id="cancel">取消</button>
            <button lay-submit class="layui-btn" id="sure" lay-filter="formDemo">确定</button>
        </div>
        <input type="hidden" id="dis" th:value="${ads}"/>
        <input type="hidden" id="isSup" th:value="${isSup}"/>
        <input type="hidden" id="localserver" th:value="${server}"/>
        <input type="hidden" id="server" th:value="${server_id}"/>
    </form>
</div>
<script type="text/javascript" src="../../../static/plugin/layui/layui.js" th:src="@{/plugin/layui/layui.js}"></script>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" data-method="notice" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" >删除</a>

</script>
<script type="text/html" id="switchTpl">
    <input type="checkbox" name="IS_DISPLAY" value="{{d.id}}" lay-skin="switch" lay-text="显示|不显示" lay-filter="sexDemo" {{ d.is_DISPLAY == 0 ? 'checked' : '' }}>
</script>
<script type="text/javascript" th:inline="none">
    layui.use(['table', 'layer', 'form'], function () {
        var table = layui.table;
        var $ = layui.jquery;
        var form = layui.form;
        table_render('/getAllDistrict');
        function table_render(url) {
            table.render({
                elem: '#test',
                width: 980,
                even: true,
                page: true,
                url: url,
                limit: 20,
                limits: [20],
                id: 'idTest',
                cols: [[
                    {type: 'checkbox', fixed: 'left', style: 'display:none'},
                    {field: 'id', width: 100, title: '序号'},
                    {field: 'school_ID', width: 100, title: '关联机构ID' },
                    {field: 'province', width: 100, title: '省份' },
                    {field: 'city', width: 100, title: '地区城市' },
                    {field: 'data_LEVEL', width: 100, title: '数据归集等级' },
                    {field: 'district_NAME', width: 138, title: '机构'},
                    {field: 'parent_NAME', width: 138, title: '上级机构'},
                    // {field: 'server_ID', width: 170, title: '服务器编号'},
                    {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 173}
                ]],
                parseData: function(res){ //res 即为原始返回的数据
                }
            });
        }

        $('.layui-btns').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });

        table.on('tool(test)', function (obj) {
            var data = obj.data;
            //console.log(obj)
            if (obj.event === 'del') {
                layer.confirm('<span style="color:#f00;">您正在删除机构，该机构下可能有管理员、发布的活动等，请确保该机构下无管理员及活动后进行该项操作！(请确认该管理员下无下属地区！若删除该地区，则下属地区及相关的活动将自动删除！)</span>', function (index) {
                    layer.close(index);
                    layer.confirm('<span style="color:#f00;">请再次确认是否删除!</span>', {
                        btn: ['狠心删除', '我再想想']
                    }, function(index, layero){
                        $.ajax({
                            url:'/deleteDistrict',
                            async: false,
                            type:"POST",
                            data:{ID:data.id},
                            success: function(data){
                                //console.log(data)
                                if(data=="success"){
                                    layer.msg("删除成功！")
                                    table_render('/getAllDistrict');
                                }else if(data=="fail"){//已有该用户名
                                    layer.msg("正在加载···")
                                    table_render('/getAllDistrict');
                                }else if(data=="chaoji"){//已有该用户名
                                    layer.msg("超级管理员地区不可删除！")
                                    table_render('/getAllDistrict');
                                }
                            }
                        })
                    });
                });
            } else if (obj.event === 'edit') {
                var dis=$("#dis").val();
                var isSup=$("#isSup").val();
                var edit_win=$(".edit_id").eq(0);
                edit_win.find("#form_action").val("/updateDistrict");
                edit_win.find("#district_NAME").val(data.district_NAME);
                edit_win.find("#province").val(data.province);
                edit_win.find("#city").val(data.city);
                edit_win.find("#data_LEVEL").val(data.data_LEVEL);
                edit_win.find("#server_ID").val(data.server_ID);
                edit_win.find("#id").val(data.id);
                $(".edit_id").css("display", "block");
            }
        });

        form.on('submit(formDemo)', function (data) {
            $.ajax({
                url:data.field.action,
                async: false,
                type:"POST",
                data:data.field,
                success: function(data){
                    //console.log(data)
                    if(data=="1"){//成功
                        table_render('/getAllDistrict');
                        edit_win.css("display", "none");
                    }else if(data=="2"){//已有该用户名
                        layer.msg("该机构已存在！")
                    }else{
                        layer.msg("添加失败！")
                    }
                }
            })
            return false;
        });
        $("#add_account").on("click", function () {
            var edit_win = $(".edit_id").eq(0);
            var server = $("#localserver").val();
            edit_win.find("#form_action").val("/addDistrictAdmin");
            edit_win.find("#edit_username").prop("readonly", false);
            edit_win.find("#server_ID").val(server);
            edit_win.css("display", "block");
        });
        $("#cancel").on("click", function () {
            $(".edit_id").css("display", "none");
        });
        $("#close").on("click", function () {
            $(".edit_id").css("display", "none");
        });
        //监听性别操作
        form.on('switch(sexDemo)', function(obj){
            $.ajax({
                url:"/updateDisplay",
                async: false,
                type:"POST",
                data:{ID:this.value,
                      Display:obj.elem.checked},
                success: function(data){
                    //console.log(data)
                    if(data=="1"){//成功
                        layer.msg("设置成功！")
                    }else if(data=="2"){
                        layer.msg("您暂无权限设置！")
                        table_render('/getAllDistrict');
                    }else {
                        layer.msg("设置失败！")
                    }
                }
            })
        });
    });
</script>
</body>
</html>